<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>乐看首页</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="/css/see/reset.min.css">
    <link rel="stylesheet" href="/css/see/swiper.min.css">
    <link rel="stylesheet" href="/css/see/index1.1.min.css?v=<%=$version%>">
</head>
<body>
<div id="seeIndex" v-cloak>
    <div class="index-top">
        <div class="indexTop-left">
            <strong>112</strong>
            <span>今日收益</span>
        </div>
        <div class="indexTop-search">
        </div>
        <span class="indexTop-icon" @click="isActive()"></span>
        <div class="indexTop-right" :class="{active:isIndextop}">
            <a href=""><span></span>发布</a>
            <a href=""><span></span>历史</a>
            <a href=""><span></span>收益</a>
            <a href=""><span></span>关注</a>
            <a href=""><span></span>任务</a>
        </div>
    </div>
    <div class="index-slide">
        <div id="indexSlide1">
            <template>
                <basic-slide :list="indexSlide1"></basic-slide>
            </template>
        </div>
        <!--<div class="swiper-container">-->
            <!--<div class="swiper-wrapper">-->
                <!--<div class="swiper-slide" v-for="list in indexSlide1">-->
                    <!--<a>-->
                        <!--<img class="swiper-lazy" :data-src="list.imgSrc">-->
                    <!--</a>-->
                <!--</div>-->
            <!--</div>-->
            <!--<div class="swiper-pagination"></div>-->
        <!--</div>-->
    </div>
    <nav class="index-nav">
        <div class="clearfix">
            <a v-for="item in categoryList" :type="item.type"><span :style="bgimg(item.imgSrc)"></span>{{item.category}}</a>
            <a href="/see/selfMedia?loginUid=1"><span class="nav-icon10"></span>全部分类</a>
        </div>
    </nav>
    <div class="index-list index-hot">
        <h4 class="index-title clearfix"><strong>热门推荐</strong><a>更多</a></h4>
        <div class="hot-top clearfix">
            <a class="hotTop-left" :href="'/see/mediaHome?loginUid=1&uid='+recommendList1.uid">
                <!--<div class="hotTop-leftImg lazy" :style="bgimg(recommendList1.coverImgSrc)"></div>-->
                <img class="hotTop-leftImg lazy" :data-original="recommendList1.coverImgSrc">
                <div class="hotTop-leftDiv">
                    <img class="lazy" :data-original="recommendList1.headImg">
                    <strong>{{recommendList1.title}}</strong>
                    <span>{{recommendList1.imgNote}}</span>
                </div>
            </a>
            <a class="hotTop-right" :href="'/see/adVideo?loginUid=1&uid='+recommendList1.uid+'&id='+recommendList1.id">
                <img src="/imgs/see/index/index-bgimg1.png" alt="">
                <strong>附近周边</strong>
                <span>汇聚周边吃/喝/玩/乐</span>
            </a>
        </div>
        <div class="hot-slide" id="indexHotSlide">
            <div class="hot-slideDiv">
                <template>
                    <index-slide :list="recommendList"></index-slide>
                </template>
            </div>
        </div>
        <template>
            <index-hotlist :list="recommendList2"></index-hotlist>
        </template>
        <template>
            <index-list :list="recommendList3"></index-list>
        </template>
        <div class="hotButt-slide">
            <div id="indexSlide3">
                <template>
                    <basic-slide :list="staticList"></basic-slide>
                </template>
            </div>
        </div>
    </div>
    <div class="index-list index-company">
        <h4 class="index-title clearfix"><strong>企业广告</strong><a>更多</a></h4>
        <div class="hot-slide" id="indexHotSlide1">
            <div class="hot-slideDiv">
                <template>
                    <index-slide :list="enterpriseList"></index-slide>
                </template>
            </div>
        </div>
        <template>
            <index-hotlist :list="enterpriseList1"></index-hotlist>
        </template>
        <template>
            <index-list :list="enterpriseList2"></index-list>
        </template>
    </div>
    <div class="index-list index-selfMedia">
        <h4 class="index-title clearfix"><strong>自媒体</strong><a>更多</a></h4>
        <div class="hot-slide" id="indexHotSlide2">
            <div class="hot-slideDiv">
                <template>
                    <index-slide :list="mediaList"></index-slide>
                </template>
            </div>
        </div>
        <template>
            <index-hotlist :list="mediaList1"></index-hotlist>
        </template>
        <template>
            <index-list :list="mediaList2"></index-list>
        </template>
    </div>
    <div class="index-list index-city">
        <h4 class="index-title clearfix"><strong>城市广告</strong><a>更多</a></h4>
        <div class="hot-slide" id="indexHotSlide3">
            <div class="hot-slideDiv">
                <template>
                    <index-slide :list="enterpriseAdvList" :number="1"></index-slide>
                </template>
            </div>
        </div>
        <div class="city-cent">
            <div class="clearfix">
                <a v-for="item in cityList">
                    <img :src="item.imgSrc" alt="">
                    <span>{{item.name}}</span>
                </a>
            </div>
        </div>
        <template>
            <index-list :list="enterpriseAdvList"></index-list>
        </template>
    </div>
    <div class="index-list index-tradition">
        <h4 class="index-title clearfix"><strong>传统文化</strong><a>更多</a></h4>
        <div class="hot-slide" id="indexHotSlide4">
            <div class="hot-slideDiv">
                <template>
                    <index-slide :list="traditionList"></index-slide>
                </template>
            </div>
        </div>
        <template>
            <index-hotlist :list="traditionList1"></index-hotlist>
        </template>
        <template>
            <index-list :list="traditionList2"></index-list>
        </template>
    </div>
    <div class="index-list index-popularity">
        <h4 class="index-title clearfix"><strong>人气推荐</strong><a>更多</a></h4>
        <template>
            <index-list :list="hotAdvList2" :number="1"></index-list>
        </template>
        <div class="loadtip" v-if="loadFlag"></div>

    </div>
    <prompt-view ref="prompt"></prompt-view>
</div>
<script src='/plugins/js/jquery-1.11.3.min.js'></script>
<script type="text/javascript" src="/plugins/js/jquery.lazyload.min.js"></script>
<script type="text/javascript" src="/plugins/js/vue.min.js"></script>
<script type="text/javascript" src="/plugins/js/swiper-3.4.2.jquery.min.js"></script>
<script type="text/javascript" src="/js/see/index1.1.js?v=<%=$version%>"></script>
<script>
    var swiper1 = new Swiper("#indexSlide1 .swiper-container",{
        spaceBetween: 30,
        centeredSlides: true,
        autoplay:1500,
        autoplayDisableOnInteraction : false,
        pagination: '.swiper-pagination',
        paginationClickable: true,
        lazyLoading : true,
        lazyLoadingInPrevNext : true,
        lazyLoadingInPrevNextAmount : 2,
        observer: true,//修改swiper自己或子元素时，自动初始化swiper
        observeParents: true//修改swiper的父元素时，自动初始化swiper
    });
    var swiper3 = new Swiper("#indexSlide3 .swiper-container",{
        spaceBetween: 30,
        centeredSlides: true,
        autoplay:1500,
        autoplayDisableOnInteraction : false,
        pagination: '.swiper-pagination',
        paginationClickable: true,
        lazyLoading : true,
        lazyLoadingInPrevNext : true,
        lazyLoadingInPrevNextAmount : 2,
        observer: true,//修改swiper自己或子元素时，自动初始化swiper
        observeParents: true//修改swiper的父元素时，自动初始化swiper
    });
    var swiper2 = new Swiper("#indexHotSlide .swiper-container", {
        effect: 'coverflow',
        grabCursor: true,
        centeredSlides: true,
        slidesPerView: 'auto',
        coverflow: {
            rotate: 0,// 旋转的角度
            stretch: 75,// 拉伸   图片间左右的间距和密集度
            depth: 127,// 深度   切换图片间上下的间距和密集度
            modifier: 3,// 修正值 该值越大前面的效果越明显
            slideShadows : true// 页面阴影效果
        },
        observer: true,//修改swiper自己或子元素时，自动初始化swiper
        observeParents: true//修改swiper的父元素时，自动初始化swiper
    });
    var swiper4 = new Swiper("#indexHotSlide1 .swiper-container", {
        effect: 'coverflow',
        grabCursor: true,
        centeredSlides: true,
        slidesPerView: 'auto',
        coverflow: {
            rotate: 0,// 旋转的角度
            stretch: 75,// 拉伸   图片间左右的间距和密集度
            depth: 127,// 深度   切换图片间上下的间距和密集度
            modifier: 3,// 修正值 该值越大前面的效果越明显
            slideShadows : true// 页面阴影效果
        },
        observer: true,//修改swiper自己或子元素时，自动初始化swiper
        observeParents: true//修改swiper的父元素时，自动初始化swiper
    });
    var swiper5 = new Swiper("#indexHotSlide2 .swiper-container", {
        effect: 'coverflow',
        grabCursor: true,
        centeredSlides: true,
        slidesPerView: 'auto',
        coverflow: {
            rotate: 0,// 旋转的角度
            stretch: 75,// 拉伸   图片间左右的间距和密集度
            depth: 127,// 深度   切换图片间上下的间距和密集度
            modifier: 3,// 修正值 该值越大前面的效果越明显
            slideShadows : true// 页面阴影效果
        },
        observer: true,//修改swiper自己或子元素时，自动初始化swiper
        observeParents: true//修改swiper的父元素时，自动初始化swiper
    });
    var swiper6 = new Swiper("#indexHotSlide3 .swiper-container", {
        effect: 'coverflow',
        grabCursor: true,
        centeredSlides: true,
        slidesPerView: 'auto',
        coverflow: {
            rotate: 0,// 旋转的角度
            stretch: 75,// 拉伸   图片间左右的间距和密集度
            depth: 127,// 深度   切换图片间上下的间距和密集度
            modifier: 3,// 修正值 该值越大前面的效果越明显
            slideShadows : true// 页面阴影效果
        },
        observer: true,//修改swiper自己或子元素时，自动初始化swiper
        observeParents: true//修改swiper的父元素时，自动初始化swiper
    });
    var swiper7 = new Swiper("#indexHotSlide4 .swiper-container", {
        effect: 'coverflow',
        grabCursor: true,
        centeredSlides: true,
        slidesPerView: 'auto',
        coverflow: {
            rotate: 0,// 旋转的角度
            stretch: 75,// 拉伸   图片间左右的间距和密集度
            depth: 127,// 深度   切换图片间上下的间距和密集度
            modifier: 3,// 修正值 该值越大前面的效果越明显
            slideShadows : true// 页面阴影效果
        },
        observer: true,//修改swiper自己或子元素时，自动初始化swiper
        observeParents: true//修改swiper的父元素时，自动初始化swiper
    });
    $("img.lazy").lazyload();
</script>
</body>
</html>